<template>
	<view>
		<view class="recharge_list" v-for="(item,index) in rechargeList" :key="index">
			<view class="recharge_list_title display align-items" v-if="item.year!=''">
				<text class="recharge_list_title_line"></text>
				{{item.year}}
			</view>
			<view class="recharge_info display space-between align-items">
				<view class="recharge_info_left">
					<view class="recharge_info_left_top">{{item.remark}}</view>
					<view class="recharge_info_left_bottom">{{item.createtime}}</view>
				</view>
				<view class="recharge_info_right" v-if="item.type=='score'">+{{item.abs}}</view>
				<view class="recharge_info_right" v-if="item.type=='amount'">+{{item.abs}}</view>
				<view class="recharge_info_right" v-if="item.type=='fund'">+{{item.abs}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: ['rechargeList'],
		data() {
			return {

			};
		}
	}
</script>

<style lang="scss" scoped>
	.recharge_list {
		// margin-bottom: 30rpx;

		.recharge_list_title {
			font-size: 26rpx;
			color: #666666;
			margin-top: 30rpx;

			.recharge_list_title_line {
				width: 5rpx;
				height: 19rpx;
				background: #294D7C;
				border-radius: 2px;
				margin-right: 8rpx;
			}
		}

		.recharge_info {
			padding: 23rpx 0;
			border-bottom: 1px solid #E5E5E5;

			.recharge_info_left {
				.recharge_info_left_top {
					color: #333333;
					font-size: 26rpx;
				}

				.recharge_info_left_bottom {
					color: #999999;
					font-size: 22rpx;
					margin-top: 0.5rpx;
				}
			}

			.recharge_info_right {
				font-size: 30rpx;
				color: #333;
			}
		}
	}
</style>
